<ion-header>
  <ion-navbar color="light" style="padding:0;" class="wudi">
    <ion-buttons start (click)="toggle()" style="padding-left:1rem;">
        <button ion-button icon-only >
            {{show_type}}
        </button>
    </ion-buttons>
    <ion-title>
        {{ 'Save' | translate }}
    </ion-title>
    <!-- <ion-buttons end style="padding-left:1rem;">
        <button ion-button icon-only style="margin-right:1rem;">
            Filter
        </button>
        <button ion-button icon-only style="margin-right:1rem;">
            Post
        </button>
    </ion-buttons> -->
  </ion-navbar>
</ion-header>

<ion-content>
  <div class="exter-container" [class.active]="show_type=='Map'">
    <div class="list-content" *ngIf="list_lst.length>0">
      <div class="house" *ngFor="let house of list_lst" (click)="goDetail(house)">
        <div class="house_content">
          <div class="house_img" [style.background-image]="house.img" style="margin-bottom:0;"><a class="iconfont"><img [src]=" house.collected?'./assets/imgs/love_active.png':'./assets/imgs/love.png' " alt=""></a></div>
          <div class="house_info">
            <p><i class="iconfont icon-map_map"></i><font>{{house.address}}</font></p>
            <p> 
              <label for=""> <i class="iconfont icon-detail_sofa"></i><font>{{house.living}}</font> </label>
              <label for=""> <i class="iconfont icon-detail_bed"></i><font>{{house.bedroom}}</font> </label>
              <label for=""> <i class="iconfont icon-bad"></i><font>{{house.bathroom}}</font> </label>
              <label for=""> <font>{{house.area}}{{house.area_unit}}({{house.other_area}}{{house.other_area_unit}})</font> </label>
            </p>
            <p>
              <font>{{house.cateName}}</font>
              <span>{{house.price_unit}} {{house.price}}<span *ngIf="house.cate!=2"> /{{house.price_type}}</span></span>
            </p>
          </div>
        </div>
      </div>
      <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
        <ion-infinite-scroll-content></ion-infinite-scroll-content>
      </ion-infinite-scroll>
    </div>
    <div class="list-content" *ngIf="list_lst.length==0">
      <div class="img-box" style="text-align: center">
          <img src="./assets/imgs/bad.png" alt="">
          <p>Nothing Saved</p>
      </div>
     
    </div>
  </div>
  <div class="exter-container" [class.active]="show_type=='List'" style="height:100%">
    <div id="map" #map style="height:100%">
      
    </div>
  </div>
</ion-content>
  